<template>
  <div class="ExportMapBotton">
      <a-button type="primary" @click="MapExport">地图导出</a-button>
  </div>
</template>

<script>
import domtoimage from 'dom-to-image';
export default {
  name:'ExportMapBotton',
   props: {
    mapDOM: {
      type: Object,
      default: null,
      required: true
    }
  },
  components:{},
  data(){
    return {
    }
  },
  created(){},
  mounted(){},
  watch:{},
  computed:{},
  methods:{
    MapExport(){
        // domtoimage.toPng(this.$refs.Map).then((dataUrl)=>{
        //    var img=new Image()
        //    img.src=dataUrl
        //    document.body.appendChild(img)
        // }).catch((error)=>{
        //    console.error('oops, something went wrong!', error)
        // })
    domtoimage.toJpeg(this.mapDOM, { quality: 1 })
    .then((dataUrl)=> {
        var link = document.createElement('a');
        link.download = 'my-image-name.jpeg';
        link.href = dataUrl;
        link.click();
    });
    },
  },
}
</script>
<style lang="scss" scoped>
</style>